﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>BlangenCen主页</title>
    <link href="~/Content/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-3.3.1.js"></script>
    <script src="~/Content/lib/ligerUI/js/core/base.js"></script>
    <script src="~/Content/lib/ligerUI/js/plugins/ligerDrag.js"></script>
    <script src="~/Content/lib/ligerUI/js/plugins/ligerDialog.js"></script>
    <script src="~/Content/lib/ligerUI/js/plugins/ligerResizable.js"></script>
    <script src="~/Content/lib/ligerUI/js/plugins/ligerLayout.js"></script>
    <style type="text/css">
        .l-case-title {
            font-weight: bold;
            margin-top: 20px;
            margin-bottom: 20px;
        }

        body, html {
            width: 100%;
            height: 100%;
        }

        * {
            margin: 0;
            padding: 0;
        }

        #winlinks {
            position: absolute;
            left: 20px;
            top: 20px;
            width: 100%;
        }

            #winlinks ul {
                position: relative;
            }

            #winlinks li {
                width: 70px;
                cursor: pointer;
                height: 80px;
                position: absolute;
                z-index: 101;
                list-style: none;
                text-align: center;
            }

                #winlinks li img {
                    width: 36px;
                    height: 36px;
                }

                #winlinks li span {
                    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3);
                    border-radius: 10px 10px 10px 10px;
                    display: block;
                    font-size: 12px;
                    margin-top: 1px;
                    color: White;
                    line-height: 18px;
                    text-align: center;
                }

                #winlinks li.l-over div.bg {
                    display: block;
                }

                #winlinks li div.bg {
                    display: none;
                    position: absolute;
                    top: -2px;
                    left: -2px;
                    z-index: 0;
                    width: 75px;
                    height: 64px;
                    -webkit-border-radius: 5px;
                    -moz-border-radius: 5px;
                    border-radius: 5px;
                    background: #000;
                    opacity: 0.1;
                    filter: alpha(opacity=10);
                }

        .l-taskbar-task-icon {
            top: 3px;
            left: 6px;
            background-image: none;
        }

        .l-taskbar-task-content {
            margin-left: 30px;
        }

        .l-taskbar-task-icon img {
            width: 22px;
            height: 22px;
        }

        #blangen {
            color: blue;
            font: bold xx-large DFKai-SB;
            float: left;
            margin: 10px 600px;
        }

        #welcome {
            font: bold 20px DFKai-SB;
            position: absolute;
            top: 30px;
            right: 50px;
        }

        #userName {
            font-size: xx-large;
            color: red;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            $("#layout1").ligerLayout({
                minLeftWidth: 80,
                minRightWidth: 80,
                topHeight: 80,
                allowTopResize: false
            });
            //注销
            $('#logout').click(function () {
                window.location.href = "/UserInfo/Logout";
            });
        });
    </script>
</head>
<body style="overflow: hidden;">
    <div id="layout1">
        <!--顶部-->-->
        <div position="top" style="height:200px;background:#B3DFDA;padding:10px;background-image:url(/Content/Images/bg3.png)">
            <img src="~/Content/Images/电竞社.png" style="height:60px;width:250px;float:left;" />
            <span id="blangen">BlangenCen独家</span>
            <span id="welcome">欢迎<span id="userName">@ViewBag.UserName</span><a id="logout" href="javascript:void(0)" style="font-size:15px;">&nbsp;注销&nbsp;</a></span>
        </div>
        <!--内容-->
        <div position="center" title="我的桌面" style="background: url(/Content/Images/夏天的学生.jpg) no-repeat  center center;">
            <div id="winlinks">
                <ul></ul>
            </div>
        </div>
    </div>

    <div style="display:none;">

    </div>

    <!--桌面内容使用的-->
    <script type="text/javascript">
        var LINKWIDTH = 90, LINKHEIGHT = 100, TASKBARHEIGHT = 43;
        var winlinksul = $("#winlinks ul");
        function f_open(url, title, icon) {
            var win = $.ligerDialog.open(
                {
                    height: 700, url: url, width: 1200, showMax: true, showToggle: true, showMin: true, isResize: true, modal: false, title: title, slide: false, buttons: [
                        {
                            text: '关闭', onclick: function (item, Dialog, index) {
                                win.hide();
                            }
                        }
                    ]
                });
            var task = jQuery.ligerui.win.tasks[win.id];
            if (task) {
                $(".l-taskbar-task-icon:first", task).html('<img src="' + icon + '" />');
            }
            return win;
        }
        var links = [
            //{ icon: '/Content/lib/images/3DSMAX.png', title: '用户管理', url: '/UserInfo/Index' },
            //{ icon: '/Content/lib/images/3DSMAX.png', title: '角色管理', url: '/RoleInfo/Index' },
            //{ icon: '/Content/lib/images/3DSMAX.png', title: '权限管理', url: '/ActionInfo/Index' },
            //{ icon: '/Content/lib/images/Program Files Folder.png', title: '固定列', url: '../grid/frozen/frozengrid.htm' },
            //{ icon: '/Content/lib/images/Program Files Folder.png', title: '可拖动', url: '../base/drag.htm' },
            //{ icon: '/Content/lib/images/Alien Folder.png', title: '树', url: '../tree/draggable.htm' },
            //{ icon: '/Content/lib/images/Xp-G5 006.png', title: '下拉框', url: '../comboBox/comboBoxGrid.htm' },
            //{ icon: '/Content/lib/images/Xp-G5 006.png', title: '下拉框', url: '../comboBox/comboBoxGrid.htm' },
            //{ icon: '/Content/lib/images/Alien Folder.png', title: 'layout', url: '../layout/layoutFullHeight.htm' },
            //{ icon: '/Content/lib/images/Alien Folder.png', title: 'menu', url: '../menu/menubar.htm' },
            //{ icon: '/Content/lib/images/Xp-G5 006.png', title: 'tab', url: '../tab/tabHtml.htm' },
            //{ icon: '/Content/lib/images/3DSMAX.png', title: '分组', url: '../grid/groupable/checkbox.htm' }
        ];

        function onResize() {
            var linksHeight = $(window).height() - TASKBARHEIGHT;
            var winlinks = $("#winlinks");
            winlinks.height(linksHeight);
            var colMaxNumber = parseInt(linksHeight / LINKHEIGHT) - 1;//一列最多显示几个快捷方式
            for (var i = 0, l = links.length; i < l; i++) {
                var link = links[i];
                var jlink = $("li[linkindex=" + i + "]", winlinks);
                var top = (i % colMaxNumber) * LINKHEIGHT, left = parseInt(i / colMaxNumber) * LINKWIDTH;
                if (isNaN(top) || isNaN(left)) continue;
                jlink.css({ top: top, left: left });
            }

        }
        function linksInit() {
            for (var i = 0, l = links.length; i < l; i++) {
                var link = links[i];
                var jlink;
                var jlink = $("<li></li>");
                jlink.attr("linkindex", i);
                jlink.append("<img src='" + link.icon + "' />");
                jlink.append("<span>" + link.title + "</span>");
                jlink.append("<div class='bg'></div>");
                jlink.hover(function () {
                    $(this).addClass("l-over");
                }, function () {
                    $(this).removeClass("l-over");
                }).click(function () {
                    var linkindex = $(this).attr("linkindex");
                    var link = links[linkindex];
                    f_open(link.url, link.title, link.icon);
                });
                jlink.appendTo(winlinksul);
            }

        }

        $(window).resize(onResize);
        $.ligerui.win.removeTaskbar = function () { }; //不允许移除
        $.ligerui.win.createTaskbar(); //页面加载时创建任务栏
        $.getJSON('/Home/Getmenus', function (data) {
            links = data;
            linksInit();
            onResize();
        });
                                    //linksInit();
                                    //onResize();
    </script>
</body>
</html>
